<template>
  <div>
    <el-row>
        <el-col :span="6">
            <div class="grid-content bg-purple">
                <h1>
                    景和千城管理平台
                </h1></div>
        </el-col>
        <el-col :span="2" :offset="16">
            <div class="grid-content bg-purple">
                {{ user_name }}
            </div>
        </el-col>



    </el-row>
    <el-row>
      <el-col :span="4">

<!--<home-menu v-on:lkl="setPermissionName"></home-menu>-->
<home-menu v-on:permissionName="setPermissionName"></home-menu>

      </el-col>
      <el-col :span="20">
          <div class="grid-content bg-purple-light">

<keep-alive>
    <component :is="permission_name" ></component>
</keep-alive>

          </div>
      </el-col>
    </el-row>
  </div>
</template>

<script>

import HomeMenu from './menu.vue';
import HomeMainIndex from './main-index.vue';
import HomeMainCityBuilding from './main-city-building.vue';
import HomeMainUserList from './main-user-list.vue';
import HomeMainServiceQingcloud from './main-service-qingcloud.vue';

export default {
    data: function () {
        return{
//            permission_name: 'index-index',
            permission_name: 'user-list',
            user_name: '飞飞',
        }
    },

    components: {
        'home-menu':HomeMenu, //导航菜单
        'index-index':HomeMainIndex, //主要-indaex
        'city-building':HomeMainCityBuilding, //主要-city-building
        'user-list':HomeMainUserList, //主要-user-list
        'service-qingcloud':HomeMainServiceQingcloud //主要-user-list
//        'city-building': '#city-building-template' //主要-city-building
    },
    methods: {
        setPermissionName:function (el) {
//            console.log('-start-')
//            console.log(el)
//            console.log('-end-')
            this.permission_name = el
//            this.currentView = el
        }

    },
    created: function () {
//        jhTools.getUserTokenData();
    }


};


</script>